<template>
    <header>
      <div class="logo">
        <h1>
          <a href="javascript:;">
            <img src="../assets/image/index/logo.jpg" alt="">
          </a>
        </h1>
      </div>
      <div class="icon">
        <!-- <a href="javascript:;" @click.prevent=""> -->
          <router-link to="/login">
            <img src="../assets/image/index/my.jpg" alt="">
          </router-link>
        <!-- </a> -->
        <a href="javascript:;">
          <img src="../assets/image/index/xiazai.jpg" alt="">
        </a>
      </div>
    </header>
</template>

<script>
export default {
  methods: {

  }
}
</script>

<style lang="less" scoped>
@color: #ff8a00;
@color1: #2f3130;
@vw: 3.20vw;
header {
  height: (42 / @vw);
  background-color: @color;
  display: flex;
  align-items: center;

  .logo {
    display: flex;
    flex: 1;
    justify-content: center;
    align-items: center;

    h1 {
      width: (100/@vw);
      height: (30/@vw);

      a {
        display: inline-block;
        width: (100/@vw);
        height: (30/@vw);

        img {
          vertical-align: top;
        }
      }
    }
  }

  .icon {
    display: flex;
    flex: 1;
    justify-content: space-evenly;
    align-items: center;

    a {
      display: inline-block;
      width: (25/@vw);
    }
  }
}
</style>
